-
Notifications
You must be signed in to change notification settings - Fork 3
Chore/bug fixes #78
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Chore/bug fixes #78
Conversation
WalkthroughThe changes introduce new optional properties and improved configurability to several UI components. The Changes
Sequence Diagram(s)sequenceDiagram
participant User
participant DraggableList
participant ListBox
User->>DraggableList: Render with dragDisabled or deletionDisabled props
DraggableList->>ListBox: Pass drag hooks if dragDisabled is false
DraggableList-->>User: Render drag handle if dragDisabled is false
DraggableList-->>User: Render delete button if deletionDisabled is false
Poem
Tip ⚡️ Faster reviews with caching
Enjoy the performance boost—your workflow just got faster. 📜 Recent review detailsConfiguration used: CodeRabbit UI 📒 Files selected for processing (1)
✅ Files skipped from review due to trivial changes (1)
🪧 TipsChatThere are 3 ways to chat with CodeRabbit:
SupportNeed help? Create a ticket on our support page for assistance with any issues or questions. Note: Be mindful of the bot's finite context window. It's strongly recommended to break down tasks such as reading entire modules into smaller chunks. For a focused discussion, use review comments to chat about specific files and their changes, instead of using the PR comments. CodeRabbit Commands (Invoked using PR comments)
Other keywords and placeholders
CodeRabbit Configuration File (
|
✅ Deploy Preview for kleros-v2-ui-storybook ready!
To edit notification comments on pull requests, go to your Netlify site configuration. |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Actionable comments posted: 0
🧹 Nitpick comments (2)
src/stories/draggable-list.stories.tsx (2)
41-47
: Good demonstration story for disabled drag functionality.The
DragDisabled
story effectively showcases the component with drag operations disabled. There's a minor typo in the JSDoc comment - an extra space afterdragDisabled
.-/** Drag operations can be disabled with `dragDisabled ` */ +/** Drag operations can be disabled with `dragDisabled` */
49-55
: Good demonstration story for disabled deletion functionality.The
DeletionDisabled
story effectively showcases the component with delete operations disabled. There's a minor typo in the JSDoc comment - an extra space afterdeletionDisabled
.-/** Delete operation can be disabled with `deletionDisabled ` */ +/** Delete operation can be disabled with `deletionDisabled` */
📜 Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro
📒 Files selected for processing (7)
src/lib/accordion/custom.tsx
(2 hunks)src/lib/accordion/index.tsx
(2 hunks)src/lib/draggable-list/index.tsx
(4 hunks)src/lib/form/bignumber-field/index.tsx
(3 hunks)src/lib/form/bignumber-field/useBigNumberField.tsx
(0 hunks)src/lib/index.ts
(1 hunks)src/stories/draggable-list.stories.tsx
(2 hunks)
💤 Files with no reviewable changes (1)
- src/lib/form/bignumber-field/useBigNumberField.tsx
🧰 Additional context used
🧬 Code Graph Analysis (2)
src/lib/accordion/custom.tsx (1)
src/utils/index.ts (1)
isUndefined
(8-11)
src/lib/accordion/index.tsx (1)
src/utils/index.ts (1)
isUndefined
(8-11)
🔇 Additional comments (16)
src/lib/index.ts (1)
18-18
: LGTM! Form component export added successfully.The export for the Form component is correctly placed among other form-related exports, following the established pattern in the file. This addition makes the Form component directly importable from the library's main entry point, improving accessibility and consistency.
src/lib/form/bignumber-field/index.tsx (3)
18-19
: Good addition of proper documentation.The JSDoc comment clearly explains the purpose of the new
name
prop, which is important for developers using this component.
34-34
: LGTM! Name prop properly included in component props.The
name
prop is correctly added to the component's parameter destructuring.
71-71
: LGTM! Name prop correctly passed to Input component.The
name
prop is properly passed down to the underlyingInput
component, enabling proper form integration and HTML form submission.src/lib/accordion/index.tsx (2)
3-3
: Nice import update for consistency.The addition of
isUndefined
makes the code more explicit in how it handles undefined/null values.
31-33
: Good enhancement in state initialization logic.Replacing the nullish coalescing operator with an explicit
isUndefined
check makes the code more consistent withCustomAccordion
and clarifies that bothnull
andundefined
values fordefaultExpanded
will result in using-1
.src/lib/accordion/custom.tsx (4)
3-3
: Good utility import for consistent null/undefined handling.Adding the
isUndefined
utility function import aligns with the approach used in the main Accordion component.
13-13
: Nice enhancement with the defaultExpanded prop.Adding this optional prop improves the component's flexibility by allowing control over which item is initially expanded.
19-19
: Good prop handling in component signature.The
defaultExpanded
prop is properly destructured from props.
22-24
: Improved state initialization with explicit undefined check.Using
isUndefined
for state initialization makes the code more explicit about handling bothnull
andundefined
values ofdefaultExpanded
.src/lib/draggable-list/index.tsx (5)
33-36
: Well-documented new props with clear purposes.The addition of
dragDisabled
anddeletionDisabled
flags with JSDoc comments clearly explains their purpose, making the component more flexible by allowing independent control over drag and delete operations.
52-53
: Good default values maintaining backward compatibility.Setting both flags to
false
by default ensures backward compatibility with existing usage of the component, as both drag and delete features remain enabled unless explicitly disabled.
85-85
: Correct implementation of drag-and-drop disabling.The implementation correctly prevents drag functionality by conditionally passing
undefined
instead of the drag-and-drop hooks whendragDisabled
is true.
115-117
: Proper visual indication of disabled drag functionality.The drag handle icon is correctly hidden when drag functionality is disabled, providing a clear visual indication to users that the feature is unavailable.
121-121
: Proper implementation of deletion disabling.The delete button is correctly hidden when
deletionDisabled
is true, even when the item is hovered, preventing users from attempting to delete items when the feature is disabled.src/stories/draggable-list.stories.tsx (1)
12-19
: Good addition of Storybook controls for new props.Adding
argTypes
for the new boolean props provides interactive controls in the Storybook UI, making it easy to test different component states.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
lgtm
|
PR-Codex overview
This PR updates the
@kleros/ui-components-library
to version3.3.4
, adds new features, and enhances existing components, particularly in theAccordion
,BigNumberField
, andDraggableList
components.Detailed summary
version
inpackage.json
to3.3.4
.Form
export insrc/lib/index.ts
.Accordion
andCustomAccordion
to useisUndefined
fordefaultExpanded
.name
prop toBigNumberField
.dragDisabled
anddeletionDisabled
props inDraggableList
.DraggableList
with new controls for drag and deletion features.Summary by CodeRabbit
New Features
Documentation
Style